<template>
  <div class="box">
    <div class="box_title">
      {{details.title}}
    </div>
    <div class="box_time overflowEllipsis">
      <small>{{details.type}}</small>&nbsp;&nbsp;{{details.time | baseTimeSplitFun}}&nbsp;&nbsp;&nbsp;来源：{{details.area}}
    </div>
    <div class="box_px"></div>
    <div class="box_txt" v-html="details.content">

    </div>
  </div>
</template>
<script>
import taskApi from "../../requestApi/taskApi";
import { Toast } from "mint-ui";
export default {
  components: {},
  data() {
    return {
      details: {
        title: "",
        content: "",
        time: "",
        type: "",
        area: ""
      }
    };
  },
  created: function() {},
  mounted() {
    let self = this;
    self.baseUserMessageDistributeFun();
    window.getAppgetUserToken = function(val) {
      self.baseUserInfoFun(val);
      self.listFun();
      self.titleFun({
        title: "详情"
      });
    };
  },
  methods: {
    async listFun() {
      let self = this;
      let params = {
        id: this.$route.query.id
      };
      let res = await taskApi.GetApiconvenienceservicesinfo(params);
      if (res.statusCode == 200) {
        self.details.title = res.data.title;
        self.details.content = res.data.content;
        self.details.time = res.data.createTime;
        self.details.area = res.data.area;
        self.details.type = res.data.type;
      } else {
        Toast({
          message: res.statusMessage,
          position: "bottom"
        });
      }
    }
  },
  filters: {},
  watch: {},
  computed: {}
};
</script>
<style scoped>
.box_px {
  margin-top: 0.3733rem;
  width: 100%;
  height: 0.0267rem;
  background-color: rgba(192, 192, 192, 0.29);
}
.box_txt {
  width: calc(100% - 0.5333rem);
  margin-left: 0.2667rem;
  margin-top: 0.4533rem;
  margin-bottom: 1.0933rem;
  overflow: hidden;
  font-size: 0.3733rem;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: #4f5058;
  line-height: 0.5867rem;
}
.box_time small {
  width: 1.0667rem;
  padding-top: 0.0533rem;
  padding-bottom: 0.0533rem;
  background: rgba(110, 180, 71, 1);
  border-radius: 0.0533rem;
  padding-left: 0.2667rem;
  padding-right: 0.2667rem;
  font-size: 0.2933rem;
  font-family: PingFang-SC-Medium;
  font-weight: 500;
  color: rgba(255, 255, 255, 1);
  margin-right: 0.1333rem;
}
.box_time {
  width: calc(100% - 0.5333rem);
  margin-left: 0.2667rem;
  margin-top: 0.3733rem;
  font-size: 0.32rem;
  font-family: PingFang-SC-Medium;
  font-weight: 500;
  color: rgba(153, 153, 153, 1);
  height: 0.5867rem;
  line-height: 0.5867rem;
  margin-top: 0.32rem;
}
.box_title {
  width: calc(100% - 0.5333rem);
  margin-left: 0.2667rem;
  min-height: 0.5867rem;
  line-height: 0.5867rem;
  font-size: 0.4533rem;
  font-family: MicrosoftYaHei;
  font-weight: 400;
  color: rgba(51, 51, 51, 1);
  margin-top: 0.4rem;
}
.box {
  background: #fff;
  overflow: hidden;
  width: 100%;
  height: 100vh;
  overflow-y: scroll;
}
</style>